
export default class Food {
    // 定义属性，表示食物对应的元素
    element: HTMLElement;

    constructor(){
        // 获取页面的food元素赋值给 element
        this.element = document.getElementById('food')!;
    }

    // 定义一个获取食物 横坐标的方法
    get X (){
        return this.element.offsetLeft;
    }
    // 定义一个获取食物 纵坐标的方法
    get Y (){
        return this.element.offsetTop;
    }

    // 修改食物的位置方法
    change(){
        // 边界区域内 随机切换
        // left： 0 - 290
        //  top： 0 - 290
        // 蛇移动一次，一格 10 px，则坐标必须是 10 的整数倍
        this.element.style.left = Math.round( Math.random() * 29) * 10 + 'px';
        this.element.style.top = Math.round( Math.random() * 29) * 10 + 'px';
    }
}

// // 测试 类的实现
// const food = new Food();
// food.change()
// console.log(food.x,food.y)